<template>
    <div class="dialog">
        <el-dialog
            title="导出数字监播"
            :model-value="modelValue"
            width="480px"
            custom-class="batch-point"
            @closed="handleClose"
        >
            <div class="content">
                <i class="iconfont icon-chenggongtishi"></i>
                <p class="title">报告分享链接复制成功</p>
                <p class="des">报告分享链接已复制到剪切板</p>
                <!-- <p>
                    {{ showData.path }}
                </p>
                <h3>{{ showData.code }}</h3> -->
            </div>

            <template #footer>
                <span class="dialog-footer">
                    <el-button type="primary" @click="handleClose"> 好的 </el-button>
                </span>
            </template>
        </el-dialog>
    </div>
</template>

<script setup lang="ts">
import { defineProps, defineEmits } from 'vue';

const emits = defineEmits<{ (e: 'update:modelValue', visible: boolean): void }>();
const props = defineProps({
    modelValue: {
        type: Boolean,
        default: false,
    },

    showData: {
        type: Object,
        default: () => {
            return {};
        },
    },
});

const handleClose = () => {
    emits('update:modelValue', false);
};
</script>

<style lang="scss" scoped>
.dialog {
    ::v-deep .el-dialog__title {
        font-weight: 700;
    }
    .content {
        text-align: center;
        i {
            font-size: 50px;
            color: #00b42a;
        }
        .title {
            text-align: center;
            font-size: 14px;
            color: #252525;
            font-weight: 500;
        }
        .des {
            text-align: center;
            color: #999999;
        }
    }
}

.batch-point {
    .batch-title {
        font-weight: 400;
        font-size: 14px;
        color: #252525;
        letter-spacing: 0;
        text-align: left;
        line-height: 18px;
        margin-bottom: 11px;
    }

    .batch-radio {
        font-weight: 400;
        font-size: 14px;
        color: #666666;
        line-height: 18px;
        display: flex;
        flex-direction: column;
        align-items: flex-start;
    }
}
</style>
